<script src="../asynx.js"></script>
<script src="../dom/dom.js"></script>
<script src="../impl/array.js"></script>
<script src="../impl/util.js"></script>
<script src="../impl/cookie.js"></script>
<script src="../impl/ajax.js"></script>
<script src="../impl/lang.js"></script>
<script src="../dom/xpath.js"></script>
<script src="../dom/selector.js"></script>
<script src="../event/event.js"></script>

<script src="../plugins/drag/drag.js"></script>
<script src="../plugins/animation/anim.js"></script>
<script src="../plugins/datalist/datalist.js"></script>
<script src="../plugins/autocomplete/autocomplete.js"></script>
<script src="../plugins/windows/windows.js"></script>

<style>
	
	.box {
		background-color: #E8EEF7;
		width: 300px;
		height: 300px;
		border: 4px #C3D9FF solid;
		z-index: 9;
	}
	
	.box2 {
		background-color: #ccc;
		width: 100px;
		height: 100px;
	}
	
</style>

<h1>asynx drag area</h1>

<div id="log" class="a">Log<br></div>

<div class="box">
	
	<div class="box2">teste</div>
	
</div>


<script>
	
	var box2 = asynx("div.box2");
	
	var d2 = new asynx.drag(box2);
	
	d2.setDragArea('div.box1');
	
</script>